package myJs.cps

import slinky.readwrite.Writer

import scala.scalajs.js
import scala.scalajs.js.|

/**
 * Created by yz on 24/1/2022
 */

@js.native
trait FlexWrap extends js.Object

object FlexWrap {

  val wrap = "wrap".asInstanceOf[FlexWrap]

}

@js.native
trait JustifyContent extends js.Object

object JustifyContent {

  val left = "left".asInstanceOf[JustifyContent]

  val center = "center".asInstanceOf[JustifyContent]

  val `flex-end` = "flex-end".asInstanceOf[JustifyContent]

}

@js.native
trait Display extends js.Object

object Display {

  val flex = "flex".asInstanceOf[Display]

  val `inline-block` = "inline-block".asInstanceOf[Display]

  val inline = "inline".asInstanceOf[Display]

  val block = "block".asInstanceOf[Display]

  val none = "none".asInstanceOf[Display]

}

@js.native
trait AlignItems extends js.Object

object AlignItems {

  val center = "center".asInstanceOf[AlignItems]

}

case class Style(
                  width: js.UndefOr[String | Int] = js.undefined,
                  color: js.UndefOr[String] = js.undefined,
                  marginTop: js.UndefOr[String | Int] = js.undefined,
                  background: js.UndefOr[String] = js.undefined,
                  display: js.UndefOr[Display] = js.undefined,
                  alignItems: js.UndefOr[AlignItems] = js.undefined,
                  marginBottom: js.UndefOr[String | Int] = js.undefined,
                  borderColor: js.UndefOr[String] = js.undefined,
                  borderWidth: js.UndefOr[Int] = js.undefined,
                  wordWrap: js.UndefOr[String] = js.undefined,
                  fontWeight: js.UndefOr[String | Int] = js.undefined,
                  paddingTop: js.UndefOr[String | Int] = js.undefined,
                  paddingLeft: js.UndefOr[String | Int] = js.undefined,
                  paddingRight: js.UndefOr[String | Int] = js.undefined,
                  marginRight: js.UndefOr[String | Int] = js.undefined,
                  padding: js.UndefOr[String] = js.undefined,
                  margin: js.UndefOr[String] = js.undefined,
                  marginLeft: js.UndefOr[String | Int] = js.undefined,
                  height: js.UndefOr[String | Int] = js.undefined,
                  border: js.UndefOr[String] = js.undefined,
                  boxShadow: js.UndefOr[String] = js.undefined,
                  transform: js.UndefOr[String] = js.undefined,
                  fontSize: js.UndefOr[String] = js.undefined,
                  lineHeight: js.UndefOr[String] = js.undefined,
                  flexWrap: js.UndefOr[FlexWrap] = js.undefined,
                  justifyContent: js.UndefOr[JustifyContent] = js.undefined,
                  flex: js.UndefOr[Int] = js.undefined,
                  backgroundImage: js.UndefOr[String] = js.undefined,
                  backgroundRepeat: js.UndefOr[String] = js.undefined,
                  backgroundSize: js.UndefOr[String] = js.undefined,
                  left: js.UndefOr[String] = js.undefined,
                  top: js.UndefOr[Int] = js.undefined,
                  position: js.UndefOr[String] = js.undefined,
                  borderRadius: js.UndefOr[String | Int] = js.undefined,
                  cursor: js.UndefOr[String] = js.undefined,
                  paddingBottom: js.UndefOr[Int] = js.undefined,
                  overflowY: js.UndefOr[String] = js.undefined,
                  minHeight: js.UndefOr[Int] = js.undefined,
                  overflow: js.UndefOr[String] = js.undefined,
                  right: js.UndefOr[Int] = js.undefined,
                  float: js.UndefOr[String] = js.undefined,
                  whiteSpace: js.UndefOr[String] = js.undefined,
                  borderRight: js.UndefOr[String] = js.undefined,
                )

object Style {

  implicit def toObject(style: Style)(implicit writer: Writer[Style]) = {
    writer.write(style)
  }

}
